<template>
  <PageWrapper ref="wrapEl" contentBackground contentClass="p-4">
    <BasicForm @register="register" />
  </PageWrapper>
</template>
<script lang="ts">
  import { Button, Upload, Row, Col } from 'ant-design-vue';
  import { defineComponent, onMounted, ref } from 'vue';
  import { BasicForm, useForm } from '@/components/Form/index';
  import Icon from '@/components/Icon/Icon.vue';
  import { TagEditor } from '@/components/Tag';
  import { useLoading } from '@/components/Loading';
  import { useMessage } from '@/hooks/web/useMessage';
  import { PageWrapper } from '@/components/Page';
  import { useDesign } from '@/hooks/web/useDesign';
  import { AjaxResultTypeEnum } from '@/enums/ajaxResultTypeEnum';
  import { formSchemas, SettingInputDto, SettingOutputDto } from './setting.data';
  import { Get, Save } from './setting.api';

  export default defineComponent({
    name: 'CompanySettingPage',
    components: {
      BasicForm,
      Button,
      Upload,
      Icon,
      ARow: Row,
      ACol: Col,
      TagEditor,
      PageWrapper,
    },
    setup() {
      const { createMessage } = useMessage();
      const wrapEl = ref<ElRef>(null);
      const [openWrapLoading, closeWrapLoading] = useLoading({
        target: wrapEl,
        props: {
          tip: '加载中...',
          absolute: true,
        },
      });

      // const settingDto = ref<Nullable<SettingDto>>(null);
      const [register, { validate, setProps, setFieldsValue }] = useForm({
        labelCol: {
          span: 6,
        },
        wrapperCol: {
          span: 17,
        },
        labelAlign: 'right',
        schemas: formSchemas,
        actionColOptions: {
          offset: 6,
          span: 14,
        },
        submitButtonOptions: {
          text: '提交',
        },
        submitFunc: SubmitFunc,
      });

      async function SubmitFunc() {
        try {
          var data = await validate();
          const ajaxResult = await Save(data);
          if (ajaxResult.Type === AjaxResultTypeEnum.Success) {
            createMessage.success(ajaxResult.Content);
          }
        } catch (error) {}
      }

      onMounted(async () => {
        const ajaxResult = await Get();
        if (ajaxResult.Type === AjaxResultTypeEnum.Success) {
          setFieldsValue({
            ...ajaxResult.Data,
          });
        }
      });

      return {
        wrapEl,
        register,
      };
    },
  });
</script>
<style lang="less" scoped></style>
